<script setup>
import {reactive} from "vue";
import {requestRegister} from "@/api";

const beforeClose = (action) =>
    new Promise((resolve) => {
      if (action === 'confirm') {
        if (registerGroup.login){
          storageGroup.saveUserInfo();
        }
        dialogGroup.show = false;
        resolve(true);
      } else {
        // 拦截取消操作
        resolve(false);
      }
    })

const dialogGroup = reactive({
  title: "注册",
  message: "默认",
  show: false,
})

const storageGroup = reactive({
  saveUserInfo(){
    uni.setStorageSync("userInfo",{
      login_state:registerGroup.login,
      username:registerGroup.username,
      account:registerGroup.account
    })
    uni.redirectTo({url:"../user/user"});
  }
})

const registerGroup = reactive({
  username: "",
  account: "",
  password: "",
  login:false,
  async userRegister() {
    let result = await requestRegister({username: this.username, account: this.account, password: this.password})
    if (result.statusCode === 200) {
      if (result.data === "DataFormatError") {
        dialogGroup.message = "昵称、账号、密码格式错误";
      } else if (result.data === "EmptyError") {
        dialogGroup.message = "昵称、账号、密码为空";
      } else if (result.data === "Normal") {
        this.login = true;
        dialogGroup.message = "注册成功";
      } else if (result.data === "DatabaseError") {
        dialogGroup.message = "数据库错误";
      } else if (result.data === "RepeatError") {
        dialogGroup.message = "账号已存在，请换一个";
      } else {
        dialogGroup.message = "服务器错误，请联系管理员";
      }
    }
    dialogGroup.show = true;
  }
})
</script>

<template>
  <van-dialog
      :before-close="beforeClose"
      :message="dialogGroup.message"
      :show="dialogGroup.show"
      :title="dialogGroup.title"
      custom-class="my-custom-class"
  />
  <view class="register-page">
    <scroll-view scroll-y="true">
      <view class="register-box">
        <view class="register">
          <view class="register-title-box">
            <view class="register-title">
              <text class="register-title-text">注册</text>
            </view>
          </view>
          <view class="register-input-box">
            <view class="register-input">
              <view class="register-input-block">
                <text class="register-input-text">昵称:</text>
                <input v-model="registerGroup.username" class="register-input-username" placeholder="请输入您的昵称"
                       type="text"/>
              </view>
              <br/>
              <view class="register-input-block">
                <text class="register-input-text">账号:</text>
                <input v-model="registerGroup.account" class="register-input-account" placeholder="请输入您的账号"
                       type="text"/>
              </view>
              <br/>
              <view class="register-input-block">
                <text class="register-input-text">密码:</text>
                <input v-model="registerGroup.password" class="register-input-password" placeholder="请输入你的密码"
                       type="password"/>
              </view>
            </view>
          </view>
          <view class="register-btn-box">
            <van-button class="register-btn" type="default" @click="registerGroup.userRegister()">注册</van-button>
          </view>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<style scoped src="../../css/register.css">

</style>